<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
	<style type="text/css">
		div{
			background: pink;
			width: 500px;
			height: 300px;
			align-items: center;
		}
	</style>
	<script type="text/javascript" src="scripts/jquery-1.7.2.min.js"></script>
	<script type="text/javascript">
		 $(function(){
			 var uidFlag=true;//这里设置为true和false感觉都有问题，不知道怎么好，如果为true，第一次就无法拦截；如果为false，后面如果输入密码错误，每次都要点一下uid输入框才起作用
			 //效验用户名（uid）
			$("#uid").blur(function(){
				//alert("失去输入用户账号焦点了");
				var uid = $("#uid").val();
				//alert("测试uid的值"+uid);
				$.ajax({
					//alert("失去焦点测试");//这里面不能用
					url:"checkUidServlet",
					type:"post",
					data:"uid="+uid,
					success:function(data){
						if(data==1){
							uidFlag=false;
							$("#uid_span").html("用户名不存在，请重新输入");
						}
						else{
							uidFlag=true;
							$("#uid_span").html("");
						}
					}
				});
			});
			/* https://zhidao.baidu.com/question/1383168400537979500.html这个页面是springmvc版的ajax改写方法 */
			
			//效验密码（password）
			//在这个外面用一个方法把密码错误信息清空

			//显示结果
			//$("#queryResult_span").html(str);
			
			//当光标放进去进行输入的时候去掉输入错误提示信息
			$("#uid").focus(function(){
				$("#uid_span").html("");
			});
			$("#upw").focus(function(){
				$("#missMsg").html("");
			});
			
			//让用户uid正确才能提交表单
			$("form").click(function(){
				//alert(uidFlag);
				/* if(uid==null||uid==""){
					alert("身份证号码不能为空");
					return false;
				}
				if($("#upw").val()==null){
					alert("密码不能为空");
					return false;
				} */
				return uidFlag;
			});
		}); 
		 
		/* function clearMissMsg(){
			document.getElementById("missMsg").innerHTML="";
		} */
		
		
	</script>
</head>
<body>
	<div align="center">
		<br/>
		<h3>公积金查询系统</h3>
		<form action="query" method="post">
			<table>
				<tr>
					<td>身份证号：</td>
					<td><input type="text" name="uid" id="uid" value="${uid }"></td>
					<td><font color="red"><span id="uid_span"></span></font>
				</tr>
				<tr>
					<td>用户密码：</td>
					<td><input type="password" name="upw" id="upw" onfocus="clearMissMsg();"></td>
					<td><span id="missMsg">${missMsg==1?"密码错误，请重新输入":"" }</span></td>
				</tr>
				<tr>
					<td>
						<input type="submit" value="提交"/>
					</td>
					
				</tr>
			</table>
		</form>
	<!-- 	<span id="queryResult_span"></span> -->
	
	<a href="/finance5_springmvc_mybatis/repassword.jsp">修改密码</a>
	
	</div>
</body>
</html>